{extend name="user_base" /} {block name="seo"}
<title>安全绑定 - {$site_config['seo_title']}</title>
<meta name="keywords" content="{$site_config['seo_keyword']}">
<meta name="description" content="{$site_config['seo_description']}">
{/block}
{block name="css"}
{/block}
{block name="main"}
<div class="title">
    安全绑定
</div>
<ul class="safe-ul layui-clear">
    <li>
        <a href="javaScript:void(0);" class="layui-clear" data-type="qq">
            <img src="__HOME__/images/qq.png"/>
            <div class="qq_nick">
                <h3>QQ快速登陆</h3>
                {if $qqcontent}
                <span data-name="{$qqcontent.nickname}">{$qqcontent.nickname}</span>
                {else /}
                <span data-name="">当前绑定：未绑定</span>
                {/if}
            </div>
        </a>
    </li>
<!--    <li>-->
<!--        <a href="javaScript:void(0);" class="layui-clear" data-type="wx">-->
<!--            <img src="__HOME__/images/wx.png"/>-->
<!--            <div>-->
<!--                <h3><i>暂停使用</i>微信快速登陆</h3>-->
<!--                <span>当前绑定：未绑定</span>-->
<!--            </div>-->
<!--        </a>-->
<!--    </li>-->
<!--    <li>-->
<!--        <a href="javaScript:void(0);" class="layui-clear" data-type="sina">-->
<!--            <img src="__HOME__/images/sina.png"/>-->
<!--            <div>-->
<!--                <h3><i>暂停使用</i>新浪快速登陆</h3>-->
<!--                <span>当前绑定：未绑定</span>-->
<!--            </div>-->
<!--        </a>-->
<!--    </li>-->
</ul>
<ul class="safe-ul layui-clear" style="margin-top:20px;border-top:1px solid #F6F6F6;padding-top:20px;">
    <li>
        <a href="javaScript:void(0);" class="layui-clear" data-code="0" data-type="mail">
            <img src="__HOME__/images/mail.png"/>
            <div>
                <h3>邮箱号码</h3>
                {if $user.email}
                <span data-name="{$user.email}">当前绑定：{$user.email}<i>解绑</i></span>
                {else /}
                <span>当前绑定：未绑定</span>
                {/if}
            </div>
        </a>
    </li>
    <li>
        <a href="javaScript:void(0);" class="layui-clear" data-type="phone">
            <img src="__HOME__/images/phone.png"/>
            <div class="mb_html">
                <h3>手机账号</h3>
                {if $user.mobile}
                <span data-name="{$user.mobile}">当前绑定：{$user.mobile}<i>解绑</i></span>
                {else /}
                <span>当前绑定：未绑定</span>
                {/if}
            </div>
        </a>
    </li>
</ul>
{/block}
{block name="script"}
<script type="text/html" id="text_phone">
    <form class="layui-form " action="" id="phone_form">
        <div class="layui-form-item" id="phone_form1"><input type="text" class="mails phone_cv" name="mobile" placeholder=""/>
            <input type="hidden" name="checktype" value="">
        </div>
        <div class="layui-form-item" style="position: relative">
            <input type="text" class="mails sd_code" name="captcha" maxlength="4" placeholder="图片验证码"/>
            <img class="imgcode" src="/index/page/captcha.html?'+Math.random();" title="点击可刷新验证码"
                 onclick="this.src='/index/page/captcha.html?'+Math.random();"
                 style="position: absolute; height: 40px; right: 1px; top: 1px;"/>
        </div>
        <div class="layui-form-item" style="position: relative">

            <input type="text" class="mails sd_dx_code" name="mobile_code" maxlength="6" placeholder="收到的验证码"/>
            <button type="button" class="layui-btn layui-btn-normal"
                    style="position: absolute; height: 42px; right: 0; top: 0; width: 106px;background-color: #ffffff; color: #0a0a0a; border: 1px solid #ececec;" id="send_code">发送验证码
            </button>
        </div>
    </form>
</script>
<script>

    layui.use(['layer'], function () {
        var layer = layui.layer;


        //跳过这一步
        $(".safe-ul a").on("click", function (e) {
            if ($(this).find("div h3 i").length > 0) {
                layer.msg("该绑定方式已被暂时禁止。");
                return;
            }
            var that = $(this);
            var type = that.data("type");
            var name = that.find("div span").data("name");

            if (type === "qq") {

                if (name) {
                    alt("提示",
                        '您当前绑定的为： <font color="#F30">' + name + '</font> 若您更换绑定后，可使用新的QQ进行登录115资源网，旧的QQ号无法用于快速登录，请知晓。',
                        function () {
                            layer.closeAll();
                            window.open("/user/qqlogin.html", "_blank");
                        },
                        ['重新绑定', '取消'], "maillayer");
                } else {
                    window.open("/user/qqlogin.html", "_blank");
                }
            } else {
                var object=type=='phone'?'手机号':'邮箱';
                var checkType=type=='phone'?2:1;

                if (name) {

                    alt("", '您当前绑定的为： <font color="#F30">' + name + '</font> 解绑后将无法使用该'+object+'登录，但可重新绑定其它'+object, function (e) {
                        alt("解绑"+object, $("#text_phone").html(), function (e) {
                            var phone_form = $("#phone_form");
                            var data_val = phone_form.field();
                            var vf = phone_form.verify({
                                mobile: function (v, item) {
                                    var objectCheck;
                                    if(type=='phone'){
                                        objectCheck=v.isPhone();
                                    }else{
                                        objectCheck=v.isEmail();
                                    }
                                    if (!objectCheck) {
                                        layer.tips("请输入正确的"+object, item, {tips: 1});
                                        return 1
                                    }

                                },

                                mobile_code: function (v, item) {
                                    if (v.length != 6) {
                                        layer.tips("请输入6位验证码", item, {tips: 1});
                                        return 1
                                    }
                                }
                            });
                            if (vf) {
                                request({
                                    url: config.api.unbind,
                                    data: {
                                        data: data_val
                                    },
                                    success: function (res) {
                                        console.log(res);
                                        if (res.code === 3) {
                                            layer.tips(res.msg, '.sd_dx_code', {tips: 1});

                                        } else if (res.code === 1) {
                                            var html = '<h3>'+object+'</h3> <span data-name="">当前绑定：未绑定</span>';
                                            $(".mb_html").html(html);
                                            layer.msg(res.msg, {icon: res.code});
                                        } else {
                                            layer.tips(res.msg, '.sd_code', {tips: 1});
                                        }

                                    }
                                })
                            }

                        });
                        if ($("#phone_form").length) {
                            $("#phone_form").find("[name=mobile]").attr('placeholder','请输入你的'+object);
                            $("#phone_form").find("[name=checktype]").val(checkType);
                        }
                        $("#send_code").timeOut({
                            send: function (send_cmd, send_val) {
                                var phone_form = $("#phone_form");
                                var data_val = phone_form.field();
                                var vf = phone_form.verify({
                                    mobile: function (v, item) {
                                        var objectCheck;
                                        if(type=='phone'){
                                            objectCheck=v.isPhone();
                                        }else{
                                            objectCheck=v.isEmail();
                                        }
                                        if (!objectCheck) {
                                            layer.tips("请输入正确的"+object, item, {tips: 1});
                                            return 1
                                        }

                                    },
                                    captcha: function (v, item) {
                                        if (v.length != 4) {
                                            layer.tips("请输入4位图形验证码", item, {tips: 1});
                                            return 1
                                        }
                                    }
                                })
                                if (vf) {
                                    request({
                                        url: config.api.ck_code_msg,
                                        data: {
                                            data: data_val
                                        },
                                        success: function (res) {
                                            if (res.code == 1) {
                                                send_cmd();
                                                layer.tips(res.msg, '#send_code', {tips: 1});
                                            } else if (res.code == 3) {
                                                layer.tips(res.msg, '.phone_cv', {tips: 1});
                                            } else {
                                                layer.tips(res.msg, '.sd_code', {tips: 1});
                                            }
                                            if (res.code != 1) {
                                                $("input[name=captcha]").val("");
                                                $(".imgcode").trigger("click");
                                            }
                                        }
                                    })
                                }

                            }
                        });


                    }, ["继续解绑", "取消"]);

                } else {
                    alt("绑定"+object, $("#text_phone").html(), function (e) {
                        var phone_form = $("#phone_form");
                        var data_val = phone_form.field();
                        var vf = phone_form.verify({
                            mobile: function (v, item) {
                                var objectCheck;
                                if(type=='phone'){
                                    objectCheck=v.isPhone();
                                }else{
                                    objectCheck=v.isEmail();
                                }
                                if (!objectCheck) {
                                    layer.tips("请输入正确的"+object, item, {tips: 1});
                                    return 1
                                }
                            },
                            mobile_code: function (v, item) {
                                if (v.length != 6) {
                                    layer.tips("请输入6位验证码", item, {tips: 1});
                                    return 1
                                }
                            }
                        });
                        if (vf) {
                            request({
                                url: config.api.bind,
                                data: {
                                    data: data_val
                                },
                                success: function (res) {
                                    console.log(res);
                                    if (res.code == 3) {
                                        layer.tips(res.msg, '.sd_dx_code', {tips: 1});

                                    } else if (res.code === 1) {
                                        var jm_zh = data_val.mobile.substr(0, 3) + "****" + data_val.mobile.substr(7, 11);
                                        var html = '<h3>'+object+'</h3> <span data-name="' + jm_zh + '">当前绑定：' + jm_zh + '<i>解绑</i></span>';
                                        $(".mb_html").html(html);
                                        layer.msg(res.msg, {icon: res.code});
                                    } else {
                                        layer.tips(res.msg, '.sd_code', {tips: 1});
                                    }
                                }
                            })
                        }
                    });
                    if ($("#phone_form").length) {
                        $("#phone_form").find("[name=mobile]").attr('placeholder','请输入你的'+object);
                        $("#phone_form").find("[name=checktype]").val(checkType);
                    }
                    $("#send_code").timeOut({
                        send: function (send_cmd, send_val) {
                            var phone_form = $("#phone_form");
                            var data_val = phone_form.field();
                            var vf = phone_form.verify({
                                mobile: function (v, item) {
                                    var objectCheck;
                                    if(type=='phone'){
                                        objectCheck=v.isPhone();
                                    }else{
                                        objectCheck=v.isEmail();
                                    }
                                    if (!objectCheck) {
                                        layer.tips("请输入正确的"+object, item, {tips: 1});
                                        return 1
                                    }
                                },
                                captcha: function (v, item) {
                                    if (v.length !== 4) {
                                        layer.tips("请输入4位图形验证码", item, {tips: 1});
                                        return 1
                                    }
                                }
                            });
                            if (vf) {
                                request({
                                    url: config.api.send_code,
                                    data: {data: data_val},
                                    success: function (res) {
                                        if (res.code === 1) {
                                            send_cmd();
                                            layer.tips(res.msg, '#send_code', {tips: 1});
                                            return false;
                                        } else if (res.code === 3) {
                                            layer.tips(res.msg, '.phone_cv', {tips: 1});
                                        } else {
                                            layer.tips(res.msg, '.sd_code', {tips: 1});
                                        }
                                        if (res.code !== 1) {
                                            $("input[name=captcha]").val("");
                                            $(".imgcode").trigger("click");
                                        }
                                    }
                                });
                            }

                        }
                    });
                }
            }
        });

        /**
         *
         * @param title
         * @param content
         * @param call
         * @param btn
         * @param addClass
         */
        function alt(title, content, call, btn, addClass) {
            layer.open({
                type: 0,
                shadeClose: false,
                title: title || "提示",
                tipsMore: true,
                skin: 'atuikeLayerSkin1 ' + addClass || "",
                content: content || "",
                btn: btn || ["确定", "取消"],
                yes: function (e) {
                    call && call()
                }
            });
        }
    });

    // var s = '';
    // if(s){
    // }else{
    //     request({
    //         url: 'index/api/m_qqnick.html', loading: false, success: function (res) {
    //             if (!(res.nick.trim())) {
    //                 res.nick = '绑定QQ授权已过期，使用绑定QQ登录';
    //             }
    //             $(".qq_nick span").data('name', res.nick).html("当前绑定：" + res.nick);
    //         }
    //     });
    // }

</script>
{/block}